import 'package:flutter/material.dart';
import 'package:toastification/toastification.dart';
import 'elegant_toast.dart';
import 'toast_utils.dart';
import 'progress_demo_page.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return ToastificationWrapper(
      child: MaterialApp(
        title: 'Toastification 宽高自定义演示',
        theme: ThemeData(
          colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
          useMaterial3: true,
        ),
        home: const ToastDemoPage(),
      ),
    );
  }
}

class ToastDemoPage extends StatefulWidget {
  const ToastDemoPage({super.key});

  @override
  State<ToastDemoPage> createState() => _ToastDemoPageState();
}

class _ToastDemoPageState extends State<ToastDemoPage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: const Text('Toastification 宽高自定义演示'),
        centerTitle: true,
      ),
      body: Padding(
        padding: const EdgeInsets.all(16.0),
        child: SingleChildScrollView(
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.stretch,
            children: [
              Card(
                child: Padding(
                  padding: const EdgeInsets.all(16.0),
                  child: Column(
                    children: [
                      Text(
                        '自定义宽高演示 📐',
                        style: Theme.of(context).textTheme.titleLarge?.copyWith(
                          color: Colors.deepOrange,
                          fontWeight: FontWeight.bold,
                        ),
                      ),
                      const SizedBox(height: 8),
                      Text(
                        '展示不同尺寸的 Toast 效果',
                        style: Theme.of(context).textTheme.bodyMedium?.copyWith(
                          color: Colors.grey.shade600,
                        ),
                      ),
                      const SizedBox(height: 16),
                      GridView.count(
                        shrinkWrap: true,
                        crossAxisCount: 3,
                        childAspectRatio: 2.2,
                        crossAxisSpacing: 8,
                        mainAxisSpacing: 8,
                        children: [
                          _buildSizeButton(
                            '紧凑型',
                            Colors.teal,
                            Icons.compress,
                            () => ElegantToast.showCompact(
                              context,
                              message: '紧凑提示',
                              type: ToastificationType.success,
                            ),
                          ),
                          _buildSizeButton(
                            '超小型',
                            Colors.deepPurple,
                            Icons.minimize,
                            () => ElegantToast.showMini(
                              context,
                              message: '超小',
                              type: ToastificationType.info,
                            ),
                          ),
                          _buildSizeButton(
                            '固定宽度',
                            Colors.indigo,
                            Icons.straighten,
                            () => ElegantToast.showFixedWidth(
                              context,
                              message: '固定宽度提示消息',
                              width: 320,
                            ),
                          ),
                          _buildSizeButton(
                            '全屏宽度',
                            Colors.pink,
                            Icons.width_wide,
                            () => ElegantToast.showFullWidth(
                              context,
                              title: '全屏提示',
                              message: '占据全屏宽度的重要通知',
                            ),
                          ),
                          _buildSizeButton(
                            '固定高度',
                            Colors.amber,
                            Icons.height,
                            () => ElegantToast.showFixedWidth(
                              context,
                              message: '固定高度提示',
                              width: 280,
                              height: 80,
                            ),
                          ),
                          _buildSizeButton(
                            '自定义图标',
                            Colors.orange,
                            Icons.star,
                            () => ElegantToast.showCustomIcon(
                              context,
                              icon: Icons.favorite,
                              message: '自定义图标提示',
                              iconColor: Colors.pink,
                            ),
                          ),
                        ],
                      ),
                      const SizedBox(height: 16),
                      Container(
                        padding: const EdgeInsets.all(12),
                        decoration: BoxDecoration(
                          color: Colors.grey.shade100,
                          borderRadius: BorderRadius.circular(8),
                          border: Border.all(color: Colors.grey.shade300),
                        ),
                        child: Column(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            Text(
                              '💡 宽高控制方法：',
                              style: TextStyle(
                                fontSize: 14,
                                fontWeight: FontWeight.w600,
                                color: Colors.grey.shade700,
                              ),
                            ),
                            const SizedBox(height: 8),
                            Text(
                              '• margin: 控制外边距，影响有效宽度\n'
                              '• padding: 控制内边距，影响内容区域\n'
                              '• Container: 用容器包装内容设置固定尺寸\n'
                              '• BoxConstraints: 设置最小/最大宽高限制\n'
                              '• 紧凑型: 宽80-140px，高28-40px\n'
                              '• 超小型: 宽60-100px，高24-32px',
                              style: TextStyle(
                                fontSize: 12,
                                color: Colors.grey.shade600,
                                height: 1.4,
                              ),
                            ),
                          ],
                        ),
                      ),
                    ],
                  ),
                ),
              ),
              const SizedBox(height: 24),
              Card(
                child: Padding(
                  padding: const EdgeInsets.all(16.0),
                  child: Column(
                    children: [
                      Text(
                        '优雅自定义 Toast ✨',
                        style: Theme.of(context).textTheme.titleLarge?.copyWith(
                          color: Colors.purple,
                          fontWeight: FontWeight.bold,
                        ),
                      ),
                      const SizedBox(height: 8),
                      Text(
                        '小巧精致，优雅美观的弹框设计',
                        style: Theme.of(context).textTheme.bodyMedium?.copyWith(
                          color: Colors.grey.shade600,
                        ),
                      ),
                      const SizedBox(height: 16),
                      GridView.count(
                        shrinkWrap: true,
                        crossAxisCount: 2,
                        childAspectRatio: 2.5,
                        crossAxisSpacing: 12,
                        mainAxisSpacing: 12,
                        children: [
                          _buildElegantButton(
                            '成功提示',
                            Colors.green,
                            Icons.check_circle_rounded,
                            () => ElegantToast.showSuccess(
                              context,
                              message: '操作成功完成！',
                            ),
                          ),
                          _buildElegantButton(
                            '错误提示',
                            Colors.red,
                            Icons.error_rounded,
                            () => ElegantToast.showError(
                              context,
                              message: '操作失败，请重试',
                            ),
                          ),
                          _buildElegantButton(
                            '警告提示',
                            Colors.orange,
                            Icons.warning_rounded,
                            () => ElegantToast.showWarning(
                              context,
                              message: '请注意安全',
                            ),
                          ),
                          _buildElegantButton(
                            '信息提示',
                            Colors.blue,
                            Icons.info_rounded,
                            () => ElegantToast.showInfo(
                              context,
                              message: '这是重要信息',
                            ),
                          ),
                        ],
                      ),
                      const SizedBox(height: 16),
                      Row(
                        children: [
                          Expanded(
                            child: ElevatedButton.icon(
                              onPressed: () => ElegantToast.showSimpleText(
                                context,
                                text: '简单优雅的文字提示',
                              ),
                              icon: const Icon(Icons.text_fields, size: 18),
                              label: const Text('纯文字'),
                              style: ElevatedButton.styleFrom(
                                backgroundColor: Colors.grey.shade700,
                                foregroundColor: Colors.white,
                                shape: RoundedRectangleBorder(
                                  borderRadius: BorderRadius.circular(8),
                                ),
                              ),
                            ),
                          ),
                          const SizedBox(width: 12),
                          Expanded(
                            child: ElevatedButton.icon(
                              onPressed: () {
                                final loadingToast = ElegantToast.showLoading(
                                  context,
                                  message: '加载中...',
                                );
                                // 3秒后自动关闭
                                Future.delayed(const Duration(seconds: 3), () {
                                  toastification.dismiss(loadingToast);
                                });
                              },
                              icon: const Icon(Icons.refresh, size: 18),
                              label: const Text('加载中'),
                              style: ElevatedButton.styleFrom(
                                backgroundColor: Colors.blue.shade600,
                                foregroundColor: Colors.white,
                                shape: RoundedRectangleBorder(
                                  borderRadius: BorderRadius.circular(8),
                                ),
                              ),
                            ),
                          ),
                        ],
                      ),
                    ],
                  ),
                ),
              ),
              const SizedBox(height: 24),
              Card(
                child: Padding(
                  padding: const EdgeInsets.all(16.0),
                  child: Column(
                    children: [
                      Text(
                        'SnackBar 原生实现 📱',
                        style: Theme.of(context).textTheme.titleLarge?.copyWith(
                          color: Colors.indigo,
                          fontWeight: FontWeight.bold,
                        ),
                      ),
                      const SizedBox(height: 8),
                      Text(
                        'Flutter 原生 SnackBar 实现的 ToastUtils',
                        style: Theme.of(context).textTheme.bodyMedium?.copyWith(
                          color: Colors.grey.shade600,
                        ),
                      ),
                      const SizedBox(height: 16),
                      GridView.count(
                        shrinkWrap: true,
                        crossAxisCount: 2,
                        childAspectRatio: 2.5,
                        crossAxisSpacing: 12,
                        mainAxisSpacing: 12,
                        children: [
                          _buildUtilsButton(
                            '成功 SnackBar',
                            Colors.green,
                            Icons.check_circle,
                            () => ToastUtils.showSuccess(
                              context,
                              message: '操作成功完成！',
                            ),
                          ),
                          _buildUtilsButton(
                            '错误 SnackBar',
                            Colors.red,
                            Icons.error,
                            () => ToastUtils.showError(
                              context,
                              message: '操作失败，请重试',
                            ),
                          ),
                          _buildUtilsButton(
                            '警告 SnackBar',
                            Colors.orange,
                            Icons.warning,
                            () => ToastUtils.showWarning(
                              context,
                              message: '请注意安全操作',
                            ),
                          ),
                          _buildUtilsButton(
                            '信息 SnackBar',
                            Colors.blue,
                            Icons.info,
                            () => ToastUtils.showInfo(
                              context,
                              message: '这是重要信息通知',
                            ),
                          ),
                        ],
                      ),
                      const SizedBox(height: 16),
                      Container(
                        padding: const EdgeInsets.all(12),
                        decoration: BoxDecoration(
                          color: Colors.indigo.shade50,
                          borderRadius: BorderRadius.circular(8),
                          border: Border.all(color: Colors.indigo.shade200),
                        ),
                        child: Column(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            Text(
                              '📝 SnackBar vs Toastification 对比：',
                              style: TextStyle(
                                fontSize: 14,
                                fontWeight: FontWeight.w600,
                                color: Colors.indigo.shade700,
                              ),
                            ),
                            const SizedBox(height: 8),
                            Text(
                              '• SnackBar: Flutter原生，底部显示，简单实用\n'
                              '• Toastification: 第三方包，位置灵活，样式丰富\n'
                              '• SnackBar: 自动适配Material Design主题\n'
                              '• Toastification: 更多自定义选项和动画效果\n'
                              '• SnackBar: 无需额外依赖，轻量级\n'
                              '• Toastification: 功能更强大，支持复杂交互',
                              style: TextStyle(
                                fontSize: 12,
                                color: Colors.indigo.shade600,
                                height: 1.4,
                              ),
                            ),
                          ],
                        ),
                      ),
                    ],
                  ),
                ),
              ),
              const SizedBox(height: 24),
              ElevatedButton.icon(
                onPressed: () {
                  Navigator.push(
                    context,
                    MaterialPageRoute(
                      builder: (context) => const ProgressTaskDemoPage(),
                    ),
                  );
                },
                icon: const Icon(Icons.trending_up),
                label: const Text('进度任务演示'),
                style: ElevatedButton.styleFrom(
                  backgroundColor: Colors.deepPurple.shade100,
                  foregroundColor: Colors.deepPurple.shade700,
                  minimumSize: const Size(double.infinity, 48),
                ),
              ),
              const SizedBox(height: 12),
              OutlinedButton.icon(
                onPressed: () {
                  toastification.dismissAll();
                },
                icon: const Icon(Icons.clear_all),
                label: const Text('清除所有 Toast'),
                style: OutlinedButton.styleFrom(
                  minimumSize: const Size(double.infinity, 48),
                ),
              ),
              const SizedBox(height: 24),
              Text(
                '适配 macOS 和 Windows 平台',
                textAlign: TextAlign.center,
                style: Theme.of(context).textTheme.bodySmall?.copyWith(
                  color: Colors.grey,
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }

  Widget _buildElegantButton(
    String label,
    Color color,
    IconData icon,
    VoidCallback onPressed,
  ) {
    return ElevatedButton(
      onPressed: onPressed,
      style: ElevatedButton.styleFrom(
        backgroundColor: color.withOpacity(0.1),
        foregroundColor: color,
        elevation: 0,
        shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.circular(12),
          side: BorderSide(color: color.withOpacity(0.3)),
        ),
        padding: const EdgeInsets.all(8),
      ),
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Icon(icon, size: 20),
          const SizedBox(height: 4),
          Text(
            label,
            style: const TextStyle(fontSize: 11, fontWeight: FontWeight.w600),
            textAlign: TextAlign.center,
          ),
        ],
      ),
    );
  }

  Widget _buildSizeButton(
    String label,
    Color color,
    IconData icon,
    VoidCallback onPressed,
  ) {
    return ElevatedButton(
      onPressed: onPressed,
      style: ElevatedButton.styleFrom(
        backgroundColor: color.withOpacity(0.1),
        foregroundColor: color,
        elevation: 0,
        shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.circular(10),
          side: BorderSide(color: color.withOpacity(0.4)),
        ),
        padding: const EdgeInsets.symmetric(horizontal: 6, vertical: 4),
      ),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Icon(icon, size: 14),
          const SizedBox(width: 4),
          Flexible(
            child: Text(
              label,
              style: const TextStyle(fontSize: 10, fontWeight: FontWeight.w600),
              textAlign: TextAlign.center,
              overflow: TextOverflow.ellipsis,
            ),
          ),
        ],
      ),
    );
  }

  Widget _buildUtilsButton(
    String label,
    Color color,
    IconData icon,
    VoidCallback onPressed,
  ) {
    return ElevatedButton(
      onPressed: onPressed,
      style: ElevatedButton.styleFrom(
        backgroundColor: color.withOpacity(0.15),
        foregroundColor: color,
        elevation: 0,
        shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.circular(12),
          side: BorderSide(color: color.withOpacity(0.5)),
        ),
        padding: const EdgeInsets.all(8),
      ),
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Icon(icon, size: 18),
          const SizedBox(height: 4),
          Text(
            label,
            style: const TextStyle(fontSize: 10, fontWeight: FontWeight.w600),
            textAlign: TextAlign.center,
            maxLines: 2,
            overflow: TextOverflow.ellipsis,
          ),
        ],
      ),
    );
  }
}